<div class="layui-card">
    <div class="layui-card-header layui-breadcrumb" style="visibility: visible">
        <a lay-href>商户系统</a><span lay-separator>/</span>
        <a><cite>账户信息</cite></a>
    </div>
</div>
<div class="layui-fluid">
    <div class="layui-row layui-col-space15">
        <script type="text/html" template lay-url="">
            <div class="layui-col-sm6 layui-col-md4">
                <div class="layui-card">
                    <div class="layui-card-header">
                        今日收款总额
                        <span class="layui-badge layui-bg-orange layuiadmin-badge">日</span>
                    </div>
                    <div class="layui-card-body layuiadmin-card-list">
                        <p class="layuiadmin-big-font finding" id="todayTotalAmount" style="font-size: larger">查询中...</p>
                        <p>
                            成功率
                            <span class="layuiadmin-span-color" id="todaySuRate"></span>
                        </p>
                    </div>
                </div>
            </div>
            <div class="layui-col-sm6 layui-col-md4">
                <div class="layui-card">
                    <div class="layui-card-header">
                        昨日收款总额
                        <span class="layui-badge layui-bg-orange layuiadmin-badge">日</span>
                    </div>
                    <div class="layui-card-body layuiadmin-card-list">
                        <p class="layuiadmin-big-font finding" id="yesterdayTotalAmount" style="font-size: larger">查询中...</p>
                        <p>
                            成功率
                            <span class="layuiadmin-span-color" id="yesterdaySuRate"></span>
                        </p>
                    </div>
                </div>
            </div>
            <div class="layui-col-sm6 layui-col-md4">
                <div class="layui-card">
                    <div class="layui-card-header">
                        收款总额
                        <span class="layui-badge layui-bg-green layuiadmin-badge">总</span>
                    </div>
                    <div class="layui-card-body layuiadmin-card-list">
                        <p class="layuiadmin-big-font finding" id="totalPayAmount" style="font-size: larger">查询中...</p>
                        <p>
                            成功率
                            <span class="layuiadmin-span-color" id="totalPaySuRate"></span>
                        </p>
                    </div>
                </div>
            </div>
            <div class="layui-col-sm6 layui-col-md4">
                <div class="layui-card">
                    <div class="layui-card-header">
                        今日代付总额
                        <span class="layui-badge layui-bg-orange layuiadmin-badge">日</span>
                    </div>
                    <div class="layui-card-body layuiadmin-card-list">
                        <p class="layuiadmin-big-font finding" id="todayAgentpayTotalAmount" style="font-size: larger">查询中...</p>
                        <p>
                            代付充值
                            <span class="layuiadmin-span-color" id="todayAgentPayRecharge"></span>
                        </p>
                    </div>
                </div>
            </div>
            <div class="layui-col-sm6 layui-col-md4">
                <div class="layui-card">
                    <div class="layui-card-header">
                        昨日代付总额
                        <span class="layui-badge layui-bg-orange layuiadmin-badge">日</span>
                    </div>
                    <div class="layui-card-body layuiadmin-card-list">
                        <p class="layuiadmin-big-font finding" id="yesterdayAgentpayTotalAmount" style="font-size: larger">查询中...</p>
                        <p>
                            代付充值
                            <span class="layuiadmin-span-color" id="yesterdayAgentpayRecharge"></span>
                        </p>
                    </div>
                </div>
            </div>
            <div class="layui-col-sm6 layui-col-md4">
                <div class="layui-card">
                    <div class="layui-card-header">
                        代付总额
                        <span class="layui-badge layui-bg-green layuiadmin-badge">总</span>
                    </div>
                    <div class="layui-card-body layuiadmin-card-list">
                        <p class="layuiadmin-big-font finding" id="totalAgentpayAmount" style="font-size: larger">查询中...</p>
                        <p>
                            代付充值总额
                            <span class="layuiadmin-span-color" id="totalAgentpayRecharge"></span>
                        </p>
                    </div>
                </div>
            </div>
        </script>
    </div>
    <div class="layui-row layui-col-space15">
        <script type="text/html" template lay-url="/api/data/count4Account">
            <!--
            <div class="layui-col-sm6 layui-col-md4">
                <div class="layui-card">
                    <div class="layui-card-header">
                        账户余额
                        <span class="layui-badge layui-bg-green layuiadmin-badge">总</span>
                    </div>
                    <div class="layui-card-body layuiadmin-card-list">
                        <p class="layuiadmin-big-font">{{ d.data.balance/100 }}</p>
                        <p>
                            不可用余额
                            <span class="layuiadmin-span-color">{{ d.data.unBalance/100 }}</span>
                        </p>
                    </div>
                </div>
            </div>
            <div class="layui-col-sm6 layui-col-md4">
                <div class="layui-card">
                    <div class="layui-card-header">
                        可结算金额
                        <span class="layui-badge layui-bg-green layuiadmin-badge">总</span>
                    </div>
                    <div class="layui-card-body layuiadmin-card-list">
                        <p class="layuiadmin-big-font">{{ d.data.availableSettAmount/100 }}</p>
                        <p>
                            冻结金额
                            <span class="layuiadmin-span-color">{{ d.data.frozenMoney/100 }}</span>
                        </p>
                    </div>
                </div>
            </div>
            -->
            <div class="layui-col-sm6 layui-col-md4">
                <div class="layui-card">
                    <div class="layui-card-header">
                        代付账户余额
                        <span class="layui-badge layui-bg-green layuiadmin-badge">总</span>
                    </div>
                    <div class="layui-card-body layuiadmin-card-list">
                        <p class="layuiadmin-big-font">{{ d.data.agentpayBalance/100 }}</p>
                        <p>
                            不可用代付余额 | 代付冻结金额
                            <span class="layuiadmin-span-color">{{ d.data.unAgentpayBalance/100 }} | {{ d.data.agentpayFrozenMoney/100 }}</span>
                        </p>
                    </div>
                </div>
            </div>
        </script>
    </div>
    <!--图表-->
    <div class="layui-col-md12" style="margin: 30px 0">
        <div class="layui-card">
            <div class="layui-card-header">近七日平台交易金额</div>
            <div class="layui-card-body">
                <div id="payOrderAcount" class="layui-input-inline" style="width: 100%;height:350px;"></div>
            </div>
        </div>
    </div>
</div>


<script>
    layui.use('console', layui.factory('console'));
</script>
<script>
    layui.use(['admin', 'echarts'], function(){
        var $ = layui.$
            ,admin = layui.admin
            ,element = layui.element
            ,echarts = layui.echarts;

        var myChart = echarts.init(document.getElementById('payOrderAcount'), layui.echartsTheme);

        admin.req({
            type: 'post',
            url: layui.setter.baseUrl + '/data/orderDayAmount',
            data: {
                access_token: layui.data(layui.setter.tableName).access_token
            },
            error: function(err) {
                layer.alert(err);
            },
            success: function(res) {
                if(res.code == 0) {
                    // 指定图表的配置项和数据
                    myChart.setOption({
                        tooltip : { //提示框
                            trigger: 'axis',
                            formatter: "{b}<br>交易金额：{c}"
                        },
                        xAxis: {
                            type: 'category',
                            data: [res.data[6], res.data[5], res.data[4], res.data[3], res.data[2], res.data[1], res.data[0]]
                        },
                        yAxis: {type: 'value'},
                        series: [{
                            type: 'line',
                            data: [
                                res.data[13]==null ? 0 : res.data[13].totalAmount/100,
                                res.data[12]==null ? 0 : res.data[12].totalAmount/100,
                                res.data[11]==null ? 0 : res.data[11].totalAmount/100,
                                res.data[10]==null ? 0 : res.data[10].totalAmount/100,
                                res.data[9]==null ? 0 : res.data[9].totalAmount/100,
                                res.data[8]==null ? 0 : res.data[8].totalAmount/100,
                                res.data[7]==null ? 0 : res.data[7].totalAmount/100,
                            ]
                        }]
                    });
                }
            }
        });
        //根据窗口的大小变动图表 --- 重点
        window.onresize = function(){
            myChart.resize();
        }

        admin.req({
            type: 'post',
            url: layui.setter.baseUrl + '/data/mchCount',
            data: {
                access_token: layui.data(layui.setter.tableName).access_token
            },
            error: function(err) {
                layer.alert(err);
            },
            success: function(res) {
                if(res.code == 0) {
                    if (res.data.todayCount != null) {
                        $(".finding").removeAttr("style");
                        $("#todayTotalAmount").html(res.data.todayCount.paySuccessAmount/100);
                        $("#todaySuRate").html(res.data.todayCount.payTotalCount == 0?"0.00% ":parseFloat((res.data.todayCount.paySuccessCount/res.data.todayCount.payTotalCount)*100).toFixed(2) + "% | (" + res.data.todayCount.paySuccessCount+"/"+res.data.todayCount.payTotalCount+")");
                        $("#todayAgentpayTotalAmount").html(res.data.todayCount.agentPaySuccessAmount/100);
                        $("#todayAgentPayRecharge").html(res.data.todayCount.rechargeSuccessAmount/100);

                    } else {
                        $(".finding").removeAttr("style");
                        $("#todayTotalAmount").html(0);
                        $("#todayAgentpayTotalAmount").html(0);
                        $("#todayAgentPayRecharge").html(0);
                        $("#todaySuRate").html("0.00% | (0/0)");
                    }

                    if (res.data.yesterdayCount != null) {
                        $(".finding").removeAttr("style");
                        $("#yesterdayTotalAmount").html(res.data.yesterdayCount.paySuccessAmount/100);
                        $("#yesterdaySuRate").html(res.data.yesterdayCount.payTotalCount == 0?"0.00% ":parseFloat((res.data.yesterdayCount.paySuccessCount/res.data.yesterdayCount.payTotalCount)*100).toFixed(2) + "% | (" + res.data.yesterdayCount.paySuccessCount+"/"+res.data.yesterdayCount.payTotalCount+")");
                        $("#yesterdayAgentpayTotalAmount").html(res.data.yesterdayCount.agentPaySuccessAmount/100);
                        $("#yesterdayAgentpayRecharge").html(res.data.yesterdayCount.rechargeSuccessAmount/100);
                    } else {
                        $(".finding").removeAttr("style");
                        $("#yesterdayTotalAmount").html(0);
                        $("#yesterdayAgentpayRecharge").html(0);
                        $("#yesterdayAgentpayTotalAmount").html(0);
                        $("#yesterdaySuRate").html("0.00% | (0/0)");
                    }

                    $("#totalPayAmount").html(res.data.collectCount.paySuccessAmount/100);
                    $("#totalAgentpayAmount").html(res.data.collectCount.agentPaySuccessAmount/100);
                    $("#totalAgentpayRecharge").html(res.data.collectCount.rechargeSuccessAmount/100);
                    if (res.data.collectCount.payTotalCount == 0) {
                        $("#totalPaySuRate").html("0.00% | (" + res.data.collectCount.paySuccessCount+"/"+res.data.collectCount.payTotalCount+")");
                    } else {
                        $("#totalPaySuRate").html(parseFloat((res.data.collectCount.paySuccessCount/res.data.collectCount.payTotalCount)*100).toFixed(2) + "% | (" + res.data.collectCount.paySuccessCount+"/"+res.data.collectCount.payTotalCount+")");
                    }
                }else {

                }
            }
        });
    });
</script>

